import { TableColumnProps } from "@arco-design/web-react";
import { IconStar } from '@arco-design/web-react/icon';
import { setList } from '@/store/router'
import { store } from '@/store/index.ts'

import './index.less'

// 自选 / 现货
export const columns: TableColumnProps[] = [
  {
    title: '交易对',
    dataIndex: 'name',
    render: (_, row) => {
      return (
        <div>
          <IconStar className={`icon-text ${row?.isOk ? 'icon-val' : ''}`} onClick={() => {
            store.dispatch(setList(row))
          }} />
          <span className="coin">{row?.coin}</span>
          /<span className="coin-data">{row?.coinInfo}</span>
          {row?.che && <span className="coin-che">{row?.che || ''}</span>}
        </div>
      )
    }
  },
  {
    title: '最新价',
    dataIndex: 'salary',
    render: (_, row) => {
      return (
        <div>
          <div className="tabel-text">{row?.amount}</div>
          <div className="tabel-an">{`≈ ${row?.am || ''}`}</div>
        </div>
      )
    }
  },
  {
    title: '24H涨跌幅',
    dataIndex: 'address',
    render: (_, row) => {
      return (
        <div style={{ color: '#00C087' }}>
          {row?.rise}

        </div>
      )
    }
  },
  {
    title: '24H涨跌幅',
    dataIndex: 'email',
    render: (_, row) => {
      return (
        <div>
          {row?.highest}
        </div>
      )
    }
  },
  {
    title: '24H最低价',
    dataIndex: 'email1',
    render: (_, row) => {
      return (
        <div>
          {row?.lowest}
        </div>
      )
    }
  },
  {
    title: '24H交易量',
    dataIndex: 'email2',
    render: (_, row) => {
      return (
        <div>
          {row?.volume}
        </div>
      )
    }
  },
];